<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html class="ui-mobile">
<head>
    <base href="."/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
    <title>简历-求职意向</title>
    <link rel="stylesheet" href="../tool/jquery-mobile/jquery.mobile-1.4.2.min.css">
    <link rel="stylesheet" href="../css/common.css">
    <script src="../tool/jquery/jquery-1.11.2.min.js"></script>
    <script src="../tool/jquery-mobile/jquery.mobile-1.4.2.min.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/http.js"></script>
    <style>
        * {
            text-shadow: none;
            font-family: '微软雅黑';
            -webkit-overflow-scrolling: touch;
        }

        * {
            margin: 0;
            padding: 0;
        }

        #titleButton {
            height: 30px;
            color: #ffffff;
            background: #ee721a;
            width: 17%;
            font-size: 15px;
            position: absolute;
            top: 7px;
            left: 10px;
            border: 1px solid #df7100;
        }

        #getmsg div {
            padding-top: 17px;
        }

        #overlay {
            display: none;
            position: fixed;
            z-index: 200;
            top: 0px;
            left: 0px;
            height: 100%;
            width: 100%;
            background: #000000;
            opacity: 0.7;
        }

        .bottom {
            width: 100%;
            position: absolute;
            bottom: 0;
            font-size: 25px;
            text-align: center;
            height: 55px;
            background: #E97500;
            color: #ffffff;
        }

        .bottom:hover {
            background: #841571;
            color: #ffffff;
        }

        .modal {
            width: 70%;
            height: 100%;
            background: #ffffff;
            position: fixed;
            top: 0;
            left: 30%;
            z-index: 1000;
            -webkit-overflow-scrolling: touch;
        }

        .modal .title {
            color: #ffffff;
            background: #ee721a;
            /*width:100%;*/
            font-size: 17px;
            padding: 10px 20px 10px 20px;
            border-bottom: 1px solid #e0e0e0;
            text-align: right;
        }

        .modal .row {
            color: #808080;
            /*width:100%;*/
            font-size: 17px;
            padding: 10px 20px 10px 20px;
            border-bottom: 1px solid #e0e0e0;
            text-align: center;
        }

        .modal .row:hover {
            color: #ffffff;
            background: #ee721a;
        }

        .modal p {
            margin: 0;
            background: #cccccc;
            padding: 15px 0 15px 20px;
            text-align: center;
            border-bottom: 1px solid #ffffff;
        }

        table {
            border-collapse: collapse;
            width: 100%;
        }

        .td_1 {
            text-align: center;
            width: 30%;
            height: 44px;
            font-size: 17px;
            border: 1px solid #C0C0C0;
            background: #EFEFEF;
        }

        .td_2 {
            position: relative;
            width: 70%;
            height: 44px;
            font-size: 15px;
            border: 1px solid #C0C0C0;
        }

        /*.td_2:hover{
            background: #e97500;
            color:#ffffff;
        }*/

        .td_2 span {
            margin-left: 50px;
            font-size: 17px;
            color: #808080;
        }

        .td_2 div {
            margin-left: 50px;
            font-size: 17px;
            color: #808080;
        }

        .must {
            color: red;
        }

        #tall {
            font-size: 19px;
            margin-left: 35px;
        }

        .hidemodal {
            position: absolute;
            right: 5px;
            top: 11px;
            width: 80px;
            height: 30px;
            background: #e99f00;
            color: #ffffff;
            border-radius: 4px;
            border: none;
        }

        .hidemodal:hover {
            background: #E97500;
            color: #ffffff;
        }

        img {
            position: absolute;
            top: 20px;
            left: 85%;
            width: 7px;
            height: 12px
        }

        .msg {
            color: red;
        }

        .spantext {
            display: inline-block;
            color: #e97500;
            width: 160px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .delay {
            width: 50%;
            height: 25%;
            background: #ffffff;
            position: fixed;
            top: 25%;
            left: 25%;
            z-index: 1000;
            display: none;
            border-radius: 10px;
            text-align: center;
        }

        .delay p {
            margin-top: 50px;
        }
    </style>
</head>
<body class="ui-mobile-viewport ui-overlay-a">
<div data-role="page" id="testpage" style="min-height: 600px; background: rgb(213, 213, 213);" data-url="testpage"
     tabindex="0" class="ui-page ui-page-theme-a ui-page-active">

    <div style="position:fixed;left:0;top:0;width:100%;z-index:200;">
        <div data-role="header"
             style="height:43px;background-color:#ee721a;margin-top:-2px;text-align:center;padding:1px" role="banner"
             class="ui-header ui-bar-inherit">
            <p style="font-size: 18px;color:#FFFFFF;margin-top: 8px;">我的简历</p>
            <button id="titleButton" style="padding: 5px 0 5px 0;text-shadow: none;" onclick="common.goTo('/html/resume.html')"
                    class="ui-btn-left ui-btn ui-shadow ui-corner-all">返回
            </button>
            <button id="save">保存</button>
        </div>
    </div>
    <div style="height:43px;background-color:#ee721a;">
    </div>
    <p style="font-size: 18px;margin:10px 0 5px 20px;">求职意向</p>

    <div style="background:#ffffff;padding:1px">
        <table>
            <tbody>
            <tr>
                <td class="td_1"><span class="must">*</span><span>工作地点</span></td>
                <td class="td_2" id="td_jobspacesList">
                    <input id="jobspace"
                           style="margin-left:20px;height:50px; border:none; font-size: 18px;color:#808080;width:75%"
                           data-role="none" type="text" value="" placeholder="请输入您期望的地点">
                </td>
            </tr>
            <tr>
                <td class="td_1"><span class="must">*</span><span>期望薪资</span></td>
                <td class="td_2" id="td_salary">
                    <input id="salary"
                           style="margin-left:20px;height:50px; border:none; font-size: 18px;color:#808080;width:75%"
                           data-role="none" type="text" value="" readonly placeholder="点击选择薪资">
                    <img src="../image/right.png" alt=""/>
                </td>
            </tr>
            <tr>
                <td class="td_1"><span class="must">*</span><span>职位类型</span></td>
                <td class="td_2" id="td_requiredjobsList">
                    <input id="requiredjobsList"
                           style="margin-left:20px;height:50px; border:none; font-size: 18px;color:#808080;width:75%"
                           data-role="none" type="text" value="" readonly placeholder="点击选择职位类型">
                    <img src="../image/right.png" alt=""/>
                </td>
            </tr>
            </tbody>
        </table>
    </div>

    <input type="hidden" id="userId"/>

    <div class="modal" id="salary_select" style="display:none">
        <div class="title">取消</div>
        <div class="row">面议</div>
        <div class="row">2001-4000元/月</div>
        <div class="row">4001-6000元/月</div>
        <div class="row">6001-8000元/月</div>
        <div class="row">8001-10000元/月</div>
        <div class="row">10001-15000元/月</div>
        <div class="row">15001-25000元/月</div>
        <div class="row">25000元/月以上</div>
    </div>

    <div class="modal" id="job_select" style="display:none;overflow-y: scroll;">
        <div class="title">
            <span style="margin-right:50%">可多选</span>确定
        </div>
        <div style="height:90%;overflow:auto;">
            <p>销售/客服/技术支持</p>
            <div>
                <div class="row">销售管理</div>
                <div class="row">销售人员</div>
                <div class="row">销售行政及商务</div>
                <div class="row">客服及技术支持</div>
            </div>
            <p>生产/营运/采购/物流</p>
            <div>
                <div class="row">生产/营运</div>
                <div class="row">质量管理/安全防护</div>
                <div class="row">工程/机械/能源</div>
                <div class="row">汽车制造</div>
                <div class="row">汽车销售与服务</div>
                <div class="row">技工</div>
                <div class="row">服装/纺织/皮革</div>
                <div class="row">采购</div>
                <div class="row">贸易</div>
                <div class="row">物流/仓储</div>
            </div>
            <p>服务业</p>
            <div>
                <div class="row">餐饮/娱乐</div>
                <div class="row">酒店/旅游</div>
                <div class="row">美容/健身/体育</div>
                <div class="row">百货/连锁/零售服务</div>
                <div class="row">交通运输服务</div>
                <div class="row">保安/家政/其他服务</div>
            </div>
            <p>会计/金融/银行/保险</p>
            <div>
                <div class="row">财务/审计/税务</div>
                <div class="row">金融/证券/期货/投资</div>
                <div class="row">银行</div>
                <div class="row">保险</div>
            </div>
            <p>广告/市场/媒体/艺术</p>
            <div>
                <div class="row">广告</div>
                <div class="row">公关/媒介</div>
                <div class="row">市场/营销</div>
                <div class="row">影视/媒体</div>
                <div class="row">写作/出版/印刷</div>
                <div class="row">艺术/设计</div>
            </div>
            <p>建筑/房地产</p>
            <div>
                <div class="row">建筑装潢/市政建设</div>
                <div class="row">房地产开发/销售</div>
                <div class="row">房地产中介</div>
                <div class="row">物业管理</div>
            </div>
            <p>计算机/互联网/通信/电子</p>
            <div>
                <div class="row">计算机硬件</div>
                <div class="row">计算机软件</div>
                <div class="row">互联网/电子商务/网游</div>
                <div class="row">IT-管理</div>
                <div class="row">IT-品管、技术支持及其它</div>
                <div class="row">通信技术开发及应用</div>
                <div class="row">电子/电器/半导体/仪器仪表</div>
            </div>
            <p>生物/制药/医疗/护理</p>
            <div>
                <div class="row">生物/制药/医疗器械</div>
                <div class="row">化工</div>
                <div class="row">医院/医疗/护理</div>
            </div>
            <p>咨询/法律/教育/科研</p>
            <div>
                <div class="row">咨询/顾问</div>
                <div class="row">律师/法务/合规</div>
                <div class="row">教师</div>
                <div class="row">培训</div>
                <div class="row">科研人员</div>
            </div>
            <p> 公务员/翻译/其他</p>
            <div>
                <div class="row">公务员</div>
                <div class="row">翻译</div>
                <div class="row">在校学生</div>
                <div class="row">储备干部/培训生/实习生</div>
                <div class="row">兼职</div>
                <div class="row">其他</div>
                <div class="row">环保</div>
                <div class="row">农/林/牧/渔</div>
            </div>
        </div>
    </div>
    <div class="delay"><p>正在保存请稍等...</p></div>
    <div id="overlay"></div>

</div>

<script type="text/javascript">
    var jobTarget = {};
    function setResumeIntention() {
        http.get({
            url: common.sctx + "/personal/resume/jobTarget/list.do",
            success: function (data) {
                if(data) {
                    jobTarget = data;
                    $("#salary").val(data.salary);
                    $("#requiredjobsList").val(data.jobType);
                    $("#jobspace").val(data.workingPlace);
                }
            }
        });
    };

    function initSelect(a, b, c, d) {

        $(a).click(function () {
            $("#overlay").css({"display": "block"});
            $(c).css({"display": "block"});
        });
        $(c).find(".title").click(function () {
            $("#overlay").css({"display": "none"});
            $(c).css({"display": "none"});
        });
        $(b).click(function () {
            $(this).css({"background": "#00a2df", "color": "#ffffff"});
            $(this).siblings(".row").css({"background": "#ffffff", "color": "#808080"});
            setTimeout(function () {
                $("#overlay").css({"display": "none"});
                $(c).css({"display": "none"});
            }, 300);
            $(d).val($(this).text());
        });
    };

    function save() {
        if (doValidate()) {
            savedata();
        }
    };

    function createData() {
        var salary = $("#salary").val();
        var requiredjobs = $("#requiredjobsList").val();
        var jobspace = $("#jobspace").val();
        var data = {
            "id": jobTarget.id,
            "workingPlace": jobspace,
            "salary": salary,
            "jobType": requiredjobs
        };
        return data;
    }

    function savedata() {
        $("#overlay").css({"display": "block"});
        $(".delay").css({"display": "block"});

        http.post({
            url: common.sctx + "/personal/resume/jobTarget/save.do",
            data: createData(),
            success: function () {
                window.location.href = common.ctx + "/html/resume.html?v="+((new Date()).getTime());
            }
        });
    }

    function doValidate() {
        var salary = $("#salary").val();
        var requiredjobs = $("#requiredjobsList").val();
        var jobspace = $("#jobspace").val();

        if (salary === '' || requiredjobs === '' || jobspace === '') {
            alert("请完整填写资料");
            return false;
        }
        return true;
    }

    $(document).ready(function () {
        common.userSession();

        setResumeIntention();
        initSelect("#td_salary", "#salary_select .row", "#salary_select", "#salary");

        $("#td_requiredjobsList ").click(function () {
            $("#overlay").css({"display": "block"});
            $("#job_select").css({"display": "block"});
        });

        $("#job_select .row").click(function () {
            if (!$(this).hasClass("select")) {
                $(this).css({"background": "#00a2df", "color": "#ffffff"});
                $(this).addClass("select");
            } else {
                $(this).css({"background": "#ffffff", "color": "#808080"});
                $(this).removeClass("select");
            }
        });

        $("#job_select p").click(function () {
            $(this).next().toggle();
        });

        $("#job_select .title").click(function () {
            var value = "";
            $("#job_select .row").each(function () {
                if ($(this).hasClass("select")) {
                    value = value + $(this).text() + '|';
                }
            });
            $("#requiredjobsList").val(value);
            $("#job_select").css({"display": "none"});
            $("#overlay").css({"display": "none"});
        });

        $("#save").click(function () {
            save();
        });
    });
</script>

<div class="ui-loader ui-corner-all ui-body-a ui-loader-default"><span class="ui-icon-loading"></span>
    <h1>loading</h1></div>
</body>
</html>